﻿@model GolfLeague.EditModels.UserEditModel

<script type="text/javascript">
    $(document).ready(function () {
        $('input:submit').button();
        $('div#buttonlist a').hover(
		    function () { $(this).addClass('ui-state-hover'); },
		    function () { $(this).removeClass('ui-state-hover'); }
	    );
    });

    //UserRoles left listbox
    //AvailableRoles right listbox

    $(function () {
        $('.AddButton').click(function (e) {
            e.preventDefault();
            MoveListItem('Add');
        });
    });

    $(function () {
        $('.RemoveButton').click(function (e) {
            e.preventDefault();
            MoveListItem('Remove');
        });
    });

    function MoveListItem(direction) {
        var fromBox;
        var toBox;
        if (direction == 'Add') {
            fromBox = document.getElementById('AvailableRoles');
            toBox = document.getElementById('UserRoles');
        } else {
            fromBox = document.getElementById('UserRoles');
            toBox = document.getElementById('AvailableRoles');
        }

        if(fromBox.length < 1) return false;
        if(fromBox.options.selectedIndex == -1) return false;
        while(fromBox.options.selectedIndex >= 0)
        {
            var newOption = new Option();
            newOption.text = fromBox.options[fromBox.options.selectedIndex].text;
            newOption.value = fromBox.options[fromBox.options.selectedIndex].value;
            toBox.options[toBox.length] = newOption;

            fromBox.remove(fromBox.options.selectedIndex);
        }
        return false;
    }

    $(function () {
        $('.UserSaveButton').click(function (e) {
            var selectList = document.getElementById('UserRoles');
            for (var i = 0, length = selectList.options.length, option; i < length; i++) {
                selectList.options[i].selected = true;
            }
            return true;
        });
    });
</script>

@{
    ViewBag.Title = "EditUser";
}

<h2>Edit User</h2>

<script src="@Url.Content("~/Content/scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Content/scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>User Info</legend>

        @Html.HiddenFor(model => model.User.ApplicationId)
        @Html.HiddenFor(model => model.User.UserId)
        @Html.HiddenFor(model => model.User.LoweredUserName)
        @Html.HiddenFor(model => model.User.MobileAlias)

        <div class="editor-label">
            @Html.LabelFor(model => model.User.UserName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.User.UserName)
            @Html.ValidationMessageFor(model => model.User.UserName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.User.IsAnonymous)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.User.IsAnonymous)
            @Html.ValidationMessageFor(model => model.User.IsAnonymous)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.User.LastActivityDate)
        </div>
        <div class="editor-field">
            @Html.DisplayFor(model => model.User.LastActivityDate)
        </div>
        <br />
        <div class="editor-field">
            <table>
                <tr>
                    <th>@Html.LabelFor(model => model.UserRoles)</th>
                    <th></th>
                    <th>Available Roles</th>
                </tr>
                <tr>
                    <td>
                        @Html.ListBoxFor(model => model.UserRoles, new SelectList(Model.CurrentRoles, "RoleID", "RoleName"), new { style = "width:100px", size = "6" })
                    </td>
                    <td>
                        <div id="buttonlist">
                            <a href="#" title="Add Role" class="AddButton ui-state-default ui-corner-all ui-icon ui-icon-circle-triangle-w"></a>
                            <br /><br />
                            <a href="#" title="Remove Role" class="RemoveButton ui-state-default ui-corner-all ui-icon ui-icon-circle-triangle-e"></a>
                        </div>
                    </td>
                    <td>
                        @Html.ListBox("AvailableRoles", new SelectList(Model.AvailableRoles, "RoleID", "RoleName"), new { style = "width:100px", size = "6" })
                    </td>
                </tr>
            </table>
        </div>

        <p>
            <input type="submit" class="UserSaveButton" value="Save" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

